1 00:00:00,630 --> 00:00:01,910 Hello and welcome. 2 00:00:01,930 --> 00:00:10,170 In this video I will be adding SS for the project inside our hastier mail. 3 00:00:10,170 --> 00:00:17,700 I've already made a reference to this he says and I call it Scott Sears says so let's go ahead and create 4 00:00:17,700 --> 00:00:18,740 that farm. 5 00:00:18,900 --> 00:00:20,340 So I'll click on the file option. 6 00:00:20,340 --> 00:00:29,880 Click on you and I'll save this new file and save it as I'm going to save it in the same directory as 7 00:00:29,880 --> 00:00:33,120 our page email files are call these quotes 8 00:00:35,320 --> 00:00:36,300 lowercase 9 00:00:39,210 --> 00:00:40,710 quotes. 10 00:00:40,820 --> 00:00:47,940 See it says so then they must match what I have specified in Maciej Titmouse sample and click on the 11 00:00:47,940 --> 00:00:52,760 drop down and just select to see says option here and click see. 12 00:00:53,050 --> 00:01:01,080 So of course the Course says so if you go to the hish mail you can see it matches what have caused it. 13 00:01:01,080 --> 00:01:05,780 So again I have staged the CSA as just to save time. 14 00:01:05,790 --> 00:01:08,100 It is really basic skill sets. 15 00:01:08,370 --> 00:01:11,340 So I going to add it and then explain the code. 16 00:01:11,700 --> 00:01:17,640 So I have added the hate mail so let me run through with you so on the left. 17 00:01:17,640 --> 00:01:22,370 When your stylin you always have to first indicate the element your styling. 18 00:01:22,440 --> 00:01:28,980 In this case I am stylin to Dave here and you can see we've got deaves here inside our hastier melts 19 00:01:29,010 --> 00:01:33,030 so all Im saying is that I want any text inside it. 20 00:01:33,150 --> 00:01:39,360 I want the text to be aligned to the centre and here will what the head one. 21 00:01:39,450 --> 00:01:45,390 We're going to hit them out here with one 8 1 which is our troll title of the app. 22 00:01:45,390 --> 00:01:55,200 So here I am set in the actual size of the text which is known as a font and set in that to t pixels 23 00:01:56,150 --> 00:01:59,830 the font family museum is impact. 24 00:01:59,940 --> 00:02:08,760 You can also specify several font families when you are specifying a font so that each one is not available. 25 00:02:08,760 --> 00:02:21,370 It will default to are no and here style in the bottom which is this here but on here on the button. 26 00:02:21,370 --> 00:02:29,000 I'm giving the width of the button to be 250 pixels the height to be 80 pixels. 27 00:02:29,100 --> 00:02:38,070 I want the background colour to be blue and I want the text inside that to be white so please feel free 28 00:02:38,070 --> 00:02:44,510 to play around with these values to try and customize them to your own taste. 29 00:02:44,530 --> 00:02:51,880 All right so with every singer says time in you must have the curly braces and the closing curly braces. 30 00:02:52,140 --> 00:03:03,950 And don't get to put the same comma the semicolon at the end of each of the csx styling. 31 00:03:04,080 --> 00:03:09,930 Okay so once you've given it a property of value you must end up with a semicolon. 32 00:03:10,320 --> 00:03:18,450 So the next time in the paragraphs or I want the font the size of the text inside the paragraph to be 33 00:03:18,690 --> 00:03:21,150 35 pixels. 34 00:03:21,770 --> 00:03:30,290 Okay so you can see again I've ended my the value of the property with a semicolon. 35 00:03:30,300 --> 00:03:31,220 Very important. 36 00:03:31,230 --> 00:03:35,700 If you miss out the semicolon in this hearsay it will not work here. 37 00:03:35,700 --> 00:03:42,200 The button hole of our basically means when I pull my mouse over the button i want b to change colour 38 00:03:42,300 --> 00:03:47,870 and the call I've given it isn't green the default core of the button is blue. 39 00:03:47,940 --> 00:03:52,600 But when you put your mouse over it I wanted to change to green. 40 00:03:52,710 --> 00:03:56,420 So again you can give yours a different colour. 41 00:03:56,450 --> 00:03:59,450 I'm just going to save this unclick save. 42 00:03:59,460 --> 00:04:03,650 And then I'm going to the application and see what it looks like. 43 00:04:04,020 --> 00:04:09,120 So I'm going to open up my direct tree which is this and take a look. 44 00:04:09,130 --> 00:04:15,110 So I've now got my CSM So let's run the team out and see what it looks like. 45 00:04:15,120 --> 00:04:15,620 Excellent. 46 00:04:15,620 --> 00:04:19,450 So this is what the application looks like at the moment. 47 00:04:19,450 --> 00:04:20,630 Obviously mopping. 48 00:04:20,630 --> 00:04:25,170 You can see this is the whole Vialls talking about Pull my mouse or variety changes. 49 00:04:25,170 --> 00:04:32,850 Clock modelling will happen at the moment because I have not incorporated the javascript functionality 50 00:04:33,390 --> 00:04:39,540 to give or see random code generation to will do that in the next lecture. 51 00:04:39,870 --> 00:04:41,340 Thank you for watching. 52 00:04:41,340 --> 00:04:42,210 Bye for now.